<link rel="stylesheet" href="/Static/mobile/vant/index.css">
<script src="/Static/mobile/vant/vue.min.js"></script>
<script src="/Static/mobile/vant/vant.min.js"></script>
<div id="app">
    <van-panel title="加盟须知" >
        <div style="padding:1em;">内容</div>
    </van-panel>
    <div style="margin:1em auto;text-align: center;">
        我同意<a target="_blank" href="http://so.com">代理协议</a> <input v-model="checked" type="checkbox"/>
    </div>
    <div style="padding:0em 1em 1em 1em;">
        <van-button @click="apply" block size="normal"  type="primary">立即申请</van-button>
    </div>

    <van-dialog
        title="选择加盟区域"
        v-model="showDialog"
        show-cancel-button
        @confirm="confirm"
    >
    <div style="margin-top:1em;">
        <van-cell-group>
            <van-cell is-link>
                <template slot="title">
                    <span class="van-cell-text">省</span>
                </template>
                <template>
                    <select style="width:100%;" id="province" name="user_province">
                    </select>
                </template>
            </van-cell>
            <van-cell is-link>
                <template slot="title">
                    <span class="van-cell-text">市</span>
                </template>
                <template>
                    <select style="width:100%;" id="city" name="user_city">
                    </select>
                </template>
            </van-cell>
            <van-cell is-link>
                <template slot="title">
                    <span class="van-cell-text">区/县</span>
                </template>
                <template>
                    <select style="width:100%;" id="county" name="user_county">
                    </select>
                </template>
            </van-cell>
        </van-cell-group>
    </div>
    </van-dialog>

</div>
<script src="__STATIC__mobile/js/areadata.js"></script>
<script src="__STATIC__mobile/js/myarea.js"></script>
<script>
    var app = new Vue({
        el: '#app',
        data: {
            showDialog: false,
            checked: true,
            applyData: {
                type: 2
            }
        },
        created: function () {
        },
        mounted: function () {
            city.getcity('province', 'city', 'county', '', '', '', 1);
        },
        methods: {
            apply: function () {
                if(!this.checked) {
                    showerror('请阅读并同意协议');
                }else{
                    this.showDialog = true;
                }
            },
            confirm: function () {
                var self = this;
                var area_id = $('#county').find("option:selected").attr('aid');
                if(!area_id) {
                    return false;
                }
                self.applyData['area_id'] = area_id;
                $.ajax({
                    type: 'post',
                    url: '/mobile/cart/apply',
                    data: self.applyData
                }).then(function (res) {
                    if(res.ret==1) {
                        showerror(res.msg);
                    }else{
                        showsuccess(res.msg);
                    }
                })
            }
        }
    })
</script>
